<!--
 * @Author: C.
 * @Date: 2021-12-27 16:59:19
 * @LastEditTime: 2021-12-27 17:35:07
 * @Description: file content
-->
<template>
  <view class="single-time">
    <view class="input-style" @click="popUpShow = true">
      <u-input
        v-model="cpnData"
        :clearable="false"
        border="none"
        fontSize="17px"
        placeholder="请填写"
        disabled
      />
    </view>
    <u-datetime-picker
      :show="popUpShow"
      v-model="getModel"
      :mode="cdata.mode ? cdata.mode : 'date'"
      @confirm="confirm"
      @cancel="popUpShow = false"
    ></u-datetime-picker>
  </view>
</template>

<script>
export default {
  props: {
    cdata: {
      type: Object,
      default: () => {}
    },
    value: {
      default: ""
    }
  },
  data() {
    return {
      popUpShow: false,
      cpnData: ""
    };
  },
  methods: {
    confirm(e) {
      console.log(e.value, e.mode);
      console.log(uni.$u.timeFormat(e.value));

      this.popUpShow = false;
    }
  },
  computed: {
    getModel: {
      get() {
        return this.value || new Date();
      },
      set(val) {
        // console.log(val, 555);
        this.$emit("input", val);
      }
    }
  }
};
</script>

<style lang="scss">
.single-time {
  .input-style {
    @include flexBox($jc: flex-start);
    background-color: $j_bgc;
    border-radius: 40rpx;
    padding: 10rpx 30rpx;
  }
}
</style>
